<template>
    <div class="enter-view">
        <mt-header fixed title="信号源入驻" class="mt-header">
            <router-link to="/user" slot="left">
                <mt-button icon="back"></mt-button>
            </router-link>
        </mt-header>
        
        <div class="content-page">
            <h3>跟随者</h3>
            <p>成为跟随着，你可以在社汇圈上跟随优秀的信号源交易，社汇圈的跟随系统可实现订单毫秒级响应。</p>
            <p class="tips">完善资料<span class="iconfont icon-jiantou"></span>去经纪商开户<span class="iconfont icon-jiantou"></span>跟随信号源交易</p>

            <div class="isRead">
                <input type="checkbox" name="vehicle" v-model="isRead" />请仔细阅读
                <router-link :to="'/home'">
                “社汇圈跟随者/信号源协议”
                </router-link>
                并同意以上条款
            </div>
            <div class="btns">
                <router-link to="/enter-choose" v-if="isRead">
                    <button>下一步</button>
                </router-link>
                <button v-else>下一步</button>
            </div>
            
        </div>

        <my-footer></my-footer>
    </div>
</template>

<script>
    import { mapState } from 'vuex'
    export default {
        name: 'EnterView',
        data(){
            return {
                isRead: true
            }
        }
    }
</script>

<style scoped>
    .enter-view{
        padding: 40px 15px 0 15px;
        text-align: left;
    }
    .mt-header {
        background: #fff;
        color: #666;
        border-bottom: 1px solid #FFF54C;
    }
    .spacing {
        height: 10px;
        background: #eee;
        margin: -1px -15px 0 -15px;
    }
    .content-page p{
        font-size: 13px;
        line-height: 24px;
        text-indent: 2rem;
        color: #666;
    }
    .content-page h3 {
        padding-bottom: 5px;
        border-bottom: 1px solid #ddd;
    }
    .content-page .tips {
        font-size: 12px;
        color: #999;
    }
    .content-page .tips span{
        font-size: 12px;
        padding: 0 5px;
    }
    .content-page .isRead {
        font-size: 12px;
        color: #666;
    }
    .content-page .isRead a {
        color: #666;
        text-decoration: none;
    }
    .content-page .btns {
        text-align: center;
    }
    .content-page button {
        display: inline-block;
        margin: 15px auto;
        width: 220px;
        height: 36px;
        line-height: 36px;
        border: none;
        background: #FFF54C;
        border-radius: 3px;
        outline: none;
    }
</style>